// 引入组件

import Vue from "vue";
import VueRouter from "vue-router";
import index from "@/views/index.vue";
import find from "@/views/find.vue";
import shoppingCart from "@/views/shoppingCart.vue";
import mine from "@/views/mine.vue";
import massage from "@/views/massage.vue";
import findList from "@/components/find/findList.vue";
import shucaishuiguo from "@/views/store/shucaishuiguo.vue";
import sekuaichaoshi from "@/views/store/sekuaichaoshi.vue";
import zhujiudian from "@/views/store/zhujiudian.vue";
import medicine from "@/views/store/medicine.vue";
import cate from "@/views/home/cate.vue";
import hotel from "@/views/home/hotel.vue";
import recreation from "@/views/home/recreation.vue";
import meifa from "@/views/home/meifa.vue";
import youxuan from "@/views/home/youxuan.vue";
import drink from "@/views/home/drink.vue";
import zu from "@/views/home/zu.vue";
import service from "@/views/home/service.vue";
import ticket from "@/views/home/ticket.vue";
import danche from "@/views/home/danche.vue";
import car from "@/views/home/car.vue";
import freefruits from "@/views/home/freefruits.vue";
import paotui from "@/views/home/paotui.vue";
import meirong from "@/views/home/meirong.vue";

import movie from "@/router/moive/moive.js";
import waimai from "@/router/waimai/waimai.js";
import login from "@/router/login";

Vue.use(VueRouter);

const routes = [
    { path: "/", redirect: "/index", meta: { title: "首页" } },
    { path: "/index", component: index, meta: { title: "首页" } },
    {
        path: "/find",
        component: find,
        redirect: "/find/list/beauty",

        children: [
            {
                path: "list/:type",
                component: findList,
                meta: { title: "电商" },
            },
        ],
    },
    {
        path: "/shoppingcart",
        component: shoppingCart,
        meta: { requiresAuth: true, title: "购物车" },
        // 独享路由守卫，只有前置没有后置
        /* beforeEnter: (to, from, next) => {
            // ...
        } */
    },
    {
        path: "/mine",
        component: mine,
        meta: { requiresAuth: true, title: "我的" },
    },
    { path: "/massage", component: massage, meta: { title: "消息" } },
    { path: "/shucaishuiguo", component: shucaishuiguo },
    { path: "/sekuaichaoshi", component: sekuaichaoshi },
    { path: "/zhujiudian", component: zhujiudian },
    { path: "/medicine", component: medicine },
    { path: "/cate", component: cate },
    { path: "/hotel", component: hotel },
    { path: "/recreation", component: recreation },
    { path: "/meifa", component: meifa },
    { path: "/youxuan", component: youxuan },
    { path: "/drink", component: drink },
    { path: "/zu", component: zu },
    { path: "/service", component: service },
    { path: "/ticket", component: ticket },
    { path: "/danche", component: danche },
    { path: "/car", component: car },
    { path: "/freefruits", component: freefruits },
    { path: "/meirong", component: meirong },
    ...movie,
    ...waimai,
    ...login,
];

const router = new VueRouter({
    /* 
        mode:
            默认为hash  是带#
            history 不带#
    */
    mode:"hash",
    routes,
});

// 全局解析守卫
// router.beforeResolve((to, from, next) => {
//     // to and from are both route objects. must call `next`.
//     next()
// })

// 全局前置路由守卫，初始化时被调用，每次路由切换之前被调用
router.beforeEach((to, from, next) => {
    let token = localStorage.getItem("token");
    // 判断路由是否需要鉴权
    if (to.matched.some(item => {return item.meta.requiresAuth})) {
        if (token) {
            // 存在token则会进入
            next();
        } else {
            // 不存在token跳转到登录页面
            next({
                path: "/login",
                // 给login传递当前页面的路径，登陆成功后直接跳转到进入登录页面之前的页面
                query: { to: to.fullPath },
            });
        }
    } else {
        // 该路由不需要鉴权
        next();
    }
});

// 全局后置路由守卫，初始化时被调用，每次路由切换之后被调用
// 常用于设置浏览器的标题

router.afterEach((to, from) => {
    // to and from are both route objects.
    document.title = to.meta.title || "叮咚";
});

export default router;
